<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
        <meta name="viewport" content="width=device-width, initial-scale=1" />
    
    <title>网点优惠信息查询</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	
	<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css">
	<meta name="viewport" content="width=device-width, initial-scale=1" /> 
	<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
	<script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>
	<style type="text/css">
	body{text-align:center;
	font-family:微软雅黑,宋体;
    font-size :20px;
    color : #f00;
    }

	</style>
  </head>
  
  <body>
  <script type="text/javascript">
  var str;
  
  var x=document.getElementById("nearcompany");
  function getLocation()
  {
	//  alert("getLocation");
  if (navigator.geolocation)
    {
	//  alert("if");
   	//	navigator.geolocation.getCurrentPosition(showPosition);
  
   //		var lng = navigator.geolocation.getCurrentPosition().coords.longitude;
   		showPosition();
    }
  else{
	//  alert("else");
	  x.innerHTML="Geolocation is not supported by this browser.";}
  }
   var EARTH_RADIUS = 6378137.0;    //单位m
    var PI = Math.PI;
  
     function getRad(d){
		 // alert("getRad");
         return d*PI/180.0;
    }
     
   function showPosition(position,lat1,lng1,lat2,lng2)
 //  function showPosition(position)
     {
		 // 	alert("showPosition");
     	     var lat1 = 39.928168;
     		 var lng1 = 116.342812;
		//	var lat1 = position.coords.latitude;
  	    //    var lng1 = position.coords.longitude;
  	     
             $.ajax({
           url:"card/querynearCompany.html",
           type:"post",
           dataType:"json",
           async: false,
           success:function(data){
             $(data).each(function(index){
               var val = data[index];

           //var lat2 = 39.962797;
            //var lng2 =116.358108;
            var lat2 = val.comlat;
            var lng2 = val.comlng;
            var radLat1 = getRad(lat1);
            var radLat2 = getRad(lat2);
            
            var a = radLat1 - radLat2;
            var b = getRad(lng1) - getRad(lng2);
            
            var s = 2*Math.asin(Math.sqrt(Math.pow(Math.sin(a/2),2) + Math.cos(radLat1)*Math.cos(radLat2)*Math.pow(Math.sin(b/2),2)));
            s = s*EARTH_RADIUS;
            s = Math.round(s*10000)/10000.0; 
  			 	if(s<=2500){
					 str="<li>商户名称："+val.comname+"   商户经度:"+val.comlat+"   商户纬度:"+val.comlng+  "</li></br>";
                     addElementDiv("nearcompany");


   				}         
           
             });
           },
           error:function() {
             alert("error");
           
           }
         });

     	     
        }
  
  $(document).ready(function(){
	  $("#search_company").click(function(){
		  $("#company").text("");
		  $.ajax({
				url:"card/queryCompany.html",
				type:"post",
				dataType:"json",
				async: false,
				data:{comName:$("#comName").val(),comArea:$("#comArea").val(),comType:$("#comType").val()},
				success:function(data){
					$(data).each(function(index){
						var val = data[index];
					 str="<li>商户名称："+val.comname+"   商户区域:"+val.comarea+"   商户类型:"+val.comtype+"   商户位置:"+val.comlat+"   商户位置:"+val.comlat+ "</li></br>";
					 addElementDiv("company");
				
					});
				},
				error:function() {
					alert("error");
				
				}
			});
	  });
	  
	  
	  
	  $("#reset_t_search").click(function(){
		  $("#comName").val("");
		  $("#comArea").val("");	
		  $("#comType").val("");
		  $("#company").text("");
	
	  });	
  });
  
  function addElementDiv(obj) {
	  var company = document.getElementById(obj);
	  var div = document.createElement("div");
	  div.setAttribute("data-role", "ollapsible");
	  div.innerHTML = str;
	  company.appendChild(div);
  }
  
  </script>
  <div data-role="page">
  <div data-role="header">
  </div>
   <h2>优惠商户</h2>
   <center>
<div class="ui-grid-b">       
  <div class="ui-block-a">
    <input type="text" name="comName" id="comName" placeholder="搜索内容...">
  </div>
  <div class="ui-block-b">
    <input type="button" id="search_company" data-inline="true" value="检索">
  </div>
</div>
</center>


   <div data-role="content">
    <form >
      <div id="near_company" data-role="fieldcontain">
        <fieldset data-role="controlgroup" data-type="horizontal">
            
            <select name="comType" id="comType">
              <option value="">分类</option>
              <option value="A">A</option>
              <option value="B">B</option>
              <option value="C">C</option>
            </select>

            
            <select name="comArea" id="comArea">
              <option value="">区域</option>
              <option value="first">a</option>
              <option value="second">b</option>
              <option value="third">c</option>
              <option value="forth">d</option>

            </select>

            <a onclick="getLocation()" href="#" data-role="button">附近</a>
        </fieldset>
      </div>
    </form>
   </div> 
   <div data-role="content">
    <div data-role="collapsible-set">
      <div data-role="collapsible">
        <input 
         type="button"value="查看" 
         onclick="javascript:window.location.href=' http://m.amap.com/navi/?dest=116.470098,39.992838&destName=A商户||联系电话：010-12345678||优惠措施：XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX&hideRouteIcon=1&key=c2a9fd3dde0d244751cd27a23fb7cb26'"/>
        <input 
         type="button"value="导航" 
         onclick="javascript:window.location.href=' http://m.amap.com/navi/?start=&dest=116.481488,39.990464&destName=到A商户去&naviBy=car/bus/walk&key=c2a9fd3dde0d244751cd27a23fb7cb26'"/>
        <h3>A商户</h3>
        <a href="tel:13011803636">拨打</a>
      </div>
      <div data-role="collapsible">
        <h3>B商户</h3>
  	    <p>地址：...</p>
  	    <p>优惠措施：...</p>
      </div>
      <div data-role="collapsible">
        <h3>C商户</h3>
  	    <p>地址：...</p>
  	    <p>优惠措施：...</p>
      </div>
      <div data-role="collapsible">
        <h3>D商户</h3>
  	    <p>地址：...</p>
  	    <p>优惠措施：...</p>
      </div>
    </div>
  </div>
  <div id="nearcompany" style="background-color:pink;width:600px;height:300px;"></div>
  </body>
</html>
